<template>
  <div>
    <!-- 搜索 -->
    <div >
      <van-search
          v-model="name"
          show-action
          placeholder="请输入搜索关键词"
          @search="searching(name)"
          @cancel="cancel()"
      />
    </div>
    <!-- 最近搜索 -->
    <div>
      <p class="p">最近搜索</p>
      <div class="dv2">
        <div class="dv1">
          {{search.info}}
        </div>
      </div>
    </div>
<!-- 历史记录   -->
    <div>
      <p class="p">历史记录</p>
    <div class="dv2"  v-for="i in infos">
      <div class="dv1">
        {{i.info}}
      </div>
    </div>
    </div>
  </div>

</template>

<script>
export default {
  name: "Search1View",
  data(){
    return{
      name:"",
      infos:[
        /*"叮咚王牌菜",
          "龙虾",
          "大盘鸡",
          "海螺"*/
      ],search:"",
    }
  },mounted() {
    this.load();
    this.load1();
  },
  methods:{
    cancel(){
      history.back();
    },
    searching(name){
      this.$router.push({path:"/search",query:{name1:name}});
    },
    load(){
      this.axios.get("/dd/select.do").then(res=>{
        if(res.data.code==200){
          this.infos=res.data.data;
        }
      })
    },
    load1(){
      this.axios.get("/dd/selectLast.do").then(res=>{
        if(res.data.code==200){
          this.search=res.data.data;
        }
      })
    }
  }
}
</script>

<style scoped>
  .p{
    font-size: 13px;
    margin-left: 10px;
    width: 100px;
  }
  .dv1{
    font-size: 7px;
    background-color: #F6F6F6;
    float: left;
    height: 20px;
    width: 80px;
    margin-left: 20px;
    margin-bottom: 10px;
    box-shadow:2px 2px 2px lightgray;
    border-radius: 5px;
  }
</style>